<template>
    <div class="mainBox">
        <div class="search">
            <el-cascader
                v-if="isShow"
                v-model="caValue"
                :options="cascaders"
            ></el-cascader>
            <h2 v-else>{{ title }}</h2>
        </div>
        <div class="fromBox">
            <div class="test">
                <h3>测试数据</h3>
                <h6>J1</h6>
                <div class="item">
                    <span>开程:</span>
                    <el-input
                        v-model="from.J1.KaiCheng.D.testData"
                        placeholder="定位"
                    ></el-input>
                    <el-input
                        v-model="from.J1.KaiCheng.F.testData"
                        placeholder="反位"
                    ></el-input>
                </div>
                <div class="item">
                    <span>锁闭量:</span>
                    <el-input
                        v-model="from.J1.SuoBiLiang.D.testData"
                        placeholder="定位"
                    ></el-input>
                    <el-input
                        v-model="from.J1.SuoBiLiang.F.testData"
                        placeholder="反位"
                    ></el-input>
                </div>
                <div class="item">
                    <span>缺口:</span>
                    <el-input
                        v-model="from.J1.QueKou.D.testData"
                        placeholder="定位"
                    ></el-input>
                    <el-input
                        v-model="from.J1.QueKou.F.testData"
                        placeholder="反位"
                    ></el-input>
                </div>
                <div class="item">
                    <span>表示电压:</span>
                    <el-input
                        v-model="from.J1.BVoltage.D.testData"
                        placeholder=""
                    ></el-input>
                    <el-input
                        v-model="from.J1.BVoltage.F.testData"
                        placeholder=""
                    ></el-input>
                </div>
                <div class="item">
                    <span>启动电压:</span>
                    <el-input
                        v-model="from.J1.QVoltage.D.testData"
                        placeholder=""
                    ></el-input>
                    <el-input
                        v-model="from.J1.QVoltage.F.testData"
                        placeholder=""
                    ></el-input>
                </div>
                <div class="item">
                    <span>启动电流:</span>
                    <el-input
                        v-model="from.J1.QCurrent.D.testData"
                        placeholder=""
                    ></el-input>
                    <el-input
                        v-model="from.J1.QCurrent.F.testData"
                        placeholder=""
                    ></el-input>
                </div>
                <h6>J2</h6>
                <div class="item">
                    <span>开程</span>
                    <el-input
                        v-model="from.J2.KaiCheng.D.testData"
                        placeholder="定位"
                    ></el-input>
                    <el-input
                        v-model="from.J2.KaiCheng.F.testData"
                        placeholder="反位"
                    ></el-input>
                </div>
                <div class="item">
                    <span>锁闭量:</span>
                    <el-input
                        v-model="from.J2.SuoBiLiang.D.testData"
                        placeholder="定位"
                    ></el-input>
                    <el-input
                        v-model="from.J2.SuoBiLiang.F.testData"
                        placeholder="反位"
                    ></el-input>
                </div>
                <div class="item">
                    <span>缺口:</span>
                    <el-input
                        v-model="from.J2.QueKou.D.testData"
                        placeholder="定位"
                    ></el-input>
                    <el-input
                        v-model="from.J2.QueKou.F.testData"
                        placeholder="反位"
                    ></el-input>
                </div>
                <div class="item">
                    <span>表示电压:</span>
                    <el-input
                        v-model="from.J2.BVoltage.D.testData"
                        placeholder=""
                    ></el-input>
                    <el-input
                        v-model="from.J2.BVoltage.F.testData"
                        placeholder=""
                    ></el-input>
                </div>
                <div class="item">
                    <span>启动电压:</span>
                    <el-input
                        v-model="from.J2.QVoltage.D.testData"
                        placeholder=""
                    ></el-input>
                    <el-input
                        v-model="from.J2.QVoltage.F.testData"
                        placeholder=""
                    ></el-input>
                </div>
                <div class="item">
                    <span>启动电流:</span>
                    <el-input
                        v-model="from.J2.QCurrent.D.testData"
                        placeholder=""
                    ></el-input>
                    <el-input
                        v-model="from.J2.QCurrent.F.testData"
                        placeholder=""
                    ></el-input>
                </div>
                <div style="height:20px"></div>
            </div>
            <div class="debug">
                <h3>调整数据</h3>
                <h6>J1</h6>
                <div class="item">
                    <span>开程:</span>
                    <el-input
                        v-model="from.J1.KaiCheng.D.adjustData"
                        placeholder="定位"
                    ></el-input>
                    <el-input
                        v-model="from.J1.KaiCheng.F.adjustData"
                        placeholder="反位"
                    ></el-input>
                </div>
                <div class="item">
                    <span>锁闭量:</span>
                    <el-input
                        v-model="from.J1.SuoBiLiang.D.adjustData"
                        placeholder="定位"
                    ></el-input>
                    <el-input
                        v-model="from.J1.SuoBiLiang.F.adjustData"
                        placeholder="反位"
                    ></el-input>
                </div>
                <div class="item">
                    <span>缺口:</span>
                    <el-input
                        v-model="from.J1.QueKou.D.adjustData"
                        placeholder="定位"
                    ></el-input>
                    <el-input
                        v-model="from.J1.QueKou.F.adjustData"
                        placeholder="反位"
                    ></el-input>
                </div>
                <h6>J2</h6>
                <div class="item">
                    <span>开程</span>
                    <el-input
                        v-model="from.J2.KaiCheng.D.adjustData"
                        placeholder="定位"
                    ></el-input>
                    <el-input
                        v-model="from.J2.KaiCheng.F.adjustData"
                        placeholder="反位"
                    ></el-input>
                </div>
                <div class="item">
                    <span>锁闭量:</span>
                    <el-input
                        v-model="from.J2.SuoBiLiang.D.adjustData"
                        placeholder="定位"
                    ></el-input>
                    <el-input
                        v-model="from.J2.SuoBiLiang.F.adjustData"
                        placeholder="反位"
                    ></el-input>
                </div>
                <div class="item">
                    <span>缺口:</span>
                    <el-input
                        v-model="from.J2.QueKou.D.adjustData"
                        placeholder="定位"
                    ></el-input>
                    <el-input
                        v-model="from.J2.QueKou.F.adjustData"
                        placeholder="反位"
                    ></el-input>
                </div>
                <h6>备注</h6>
                <div
                    class="item re"
                    v-for="(item, index) of machineRemarks"
                    :key="index"
                >
                    <span>{{ item.type + ":" }}</span>
                    <el-input v-model="item.content" placeholder=""></el-input>
                </div>
                <div class="item ra">
                    <span>状态:</span>
                    <div class="cc">
                        <el-radio v-model="radio" :label="false">正常</el-radio>
                        <el-radio v-model="radio" :label="true"
                            >待整改</el-radio
                        >
                    </div>
                </div>
                <div class="item re" v-if="radio">
                    <span></span>
                    <el-input
                        v-model="problemRemark"
                        placeholder="输入备注"
                    ></el-input>
                </div>
                <div style="height:20px"></div>
            </div>
        </div>
        <div class="end" @click="submit">提交</div>
    </div>
</template>

<script>
import data from "./data";
export default {
    data() {
        return {
            isShow: true,
            input: "",
            caValue: [],
            cascaders: [],
            from: {
                J1: {},
                J2: {},
            },
            title: "",
            machineRemarks: [
                {
                    content: "",
                    type: "密贴",
                },
                {
                    content: "",
                    type: "2/4mm 实验",
                },
                {
                    content: "",
                    type: "顶铁",
                },
                {
                    content: "",
                    type: "滑床板",
                },
            ],
            region: "",
            to: "",
            radio: false,
            problemRemark: "",
        };
    },
    created() {
        this.formatData(data);
        if (this.$route.query.id) {
            this.isShow = false;
            this.$http
                .get(
                    `services/app/MachineDataService/GetGroupMachineData?recordId=${this.$route.query.id}`
                )
                .then((res) => {
                    let datas = res.data.result
                        ? res.data.result.machineDatas
                        : data;
                    this.machineRemarks = res.data.result.machineRemarks;
                    this.region = res.data.result.machineCode;
                    this.to = res.data.result.stationArea;
                    if (res.data.result["problemRemark"]) {
                        this.problemRemark = res.data.result["problemRemark"];
                        this.radio = true;
                    }
                    this.title =
                        res.data.result.stationArea +
                        "/" +
                        res.data.result.machineCode;
                    this.formatData(datas);
                });
        }
    },
    mounted() {
        this.$http
            .get(
                "services/app/MachineService/GetStationAndMachineCode"
            )
            .then((res) => {
                this.cascaders = res.data.result;
            });
    },
    methods: {
        formatData(datas) {
            datas.forEach((item) => {
                let i = "F";
                if (item.position === "定位") i = "D";
                if (!this.from[item.jSwitch][item.dataType]) {
                    this.$set(this.from[item.jSwitch], item.dataType, {});
                }
                if (!this.from[item.jSwitch][item.dataType][i]) {
                    this.$set(this.from[item.jSwitch][item.dataType], i, {});
                }
                this.$set(
                    this.from[item.jSwitch][item.dataType][i],
                    "testData",
                    item.testData == 0 ? "" : item.testData + ""
                );
                this.$set(
                    this.from[item.jSwitch][item.dataType][i],
                    "adjustData",
                    item.adjustData == 0 ? "" : item.adjustData + ""
                );
            });
        },
        submit() {
            if (this.isShow && !this.caValue[1]) {
                this.$message.error("请选择转辙机！");
                return;
            }
            let params = [];
            let gud = ["KaiCheng", "SuoBiLiang", "QueKou"];
            let name = ["开程", "锁闭量", "缺口"];
            for (let i of Object.keys(this.from.J1)) {
                if (gud.indexOf(i) !== -1) {
                    if (
                        !(
                            (this.from.J1[i].F.testData == "" &&
                                this.from.J1[i].F.adjustData == "" &&
                                this.from.J1[i].D.testData == "" &&
                                this.from.J1[i].D.adjustData == "") ||
                            (this.from.J1[i].F.testData.length > 0 &&
                                this.from.J1[i].F.adjustData.length > 0 &&
                                this.from.J1[i].D.testData.length > 0 &&
                                this.from.J1[i].D.adjustData.length > 0)
                        )
                    ) {
                        this.$message.error(
                            "请将J1" + name[gud.indexOf(i)] + "填写完整"
                        );
                        return;
                    }
                    if (this.from.J1[i].F.testData == "") continue;
                } else if (
                    this.from.J1[i].F.testData == "" &&
                    this.from.J1[i].D.testData == ""
                ) {
                    continue;
                }
                for (let j of Object.keys(this.from.J1[i])) {
                    if (j == "D") {
                        params.push({
                            jSwitch: "J1",
                            position: "定位",
                            dataType: i,
                            testData: this.from.J1[i][j].testData - 0,
                            adjustData: this.from.J1[i][j].adjustData - 0,
                        });
                    } else {
                        params.push({
                            jSwitch: "J1",
                            position: "反位",
                            dataType: i,
                            testData: this.from.J1[i][j].testData - 0,
                            adjustData: this.from.J1[i][j].adjustData - 0,
                        });
                    }
                }
            }
            for (let i of Object.keys(this.from.J2)) {
                if (gud.indexOf(i) !== -1) {
                    if (
                        !(
                            (this.from.J2[i].F.testData == "" &&
                                this.from.J2[i].F.adjustData == "" &&
                                this.from.J2[i].D.testData == "" &&
                                this.from.J2[i].D.adjustData == "") ||
                            (this.from.J2[i].F.testData.length > 0 &&
                                this.from.J2[i].F.adjustData.length > 0 &&
                                this.from.J2[i].D.testData.length > 0 &&
                                this.from.J2[i].D.adjustData.length > 0)
                        )
                    ) {
                        this.$message.error(
                            "请将J2" + name[gud.indexOf(i)] + "填写完整"
                        );
                        return;
                    }
                    if (this.from.J2[i].F.testData == "") continue;
                } else if (
                    this.from.J2[i].F.testData == "" &&
                    this.from.J2[i].D.testData == ""
                ) {
                    continue;
                }
                for (let j of Object.keys(this.from.J2[i])) {
                    if (j == "D") {
                        params.push({
                            jSwitch: "J2",
                            position: "定位",
                            dataType: i,
                            testData: this.from.J2[i][j].testData - 0,
                            adjustData: this.from.J2[i][j].adjustData - 0,
                        });
                    } else {
                        params.push({
                            jSwitch: "J2",
                            position: "反位",
                            dataType: i,
                            testData: this.from.J2[i][j].testData - 0,
                            adjustData: this.from.J2[i][j].adjustData - 0,
                        });
                    }
                }
            }
            let getObj = {
                machineCode: this.caValue[1] ? this.caValue[1] : this.region,
                machineDatas: params,
                machineRemarks: this.machineRemarks,
                problemRemark: this.radio ? this.problemRemark : "",
                status: this.radio ? 1 : 0,
            };
            console.log(getObj.status, "??");
            if (this.$route.query.id) {
                getObj["recordId"] = this.$route.query.id;
                getObj.machineDatas.forEach((item) => {
                    item["recordId"] = this.$route.query.id;
                });
                getObj.machineRemarks["recordId"] = this.$route.query.id;
                this.$http
                    .put(
                        "services/app/MachineDataService/UpdateGroupMachineData",
                        getObj
                    )
                    .then(() => {
                        this.cascaders = res.data.result;
                    });
                this.$router.push({
                    name: "homePage",
                    query: {
                        one: this.caValue[0] ? this.caValue[0] : this.to,
                        two: this.caValue[1] ? this.caValue[1] : this.region,
                    },
                });
                return;
            }
            this.$http
                .post(
                    "services/app/MachineDataService/AddAllMachineData",
                    getObj
                )
                .then((res) => {
                    this.$router.push({
                        name: "homePage",
                        query: {
                            one: this.caValue[0] ? this.caValue[0] : this.to,
                            two: this.caValue[1]
                                ? this.caValue[1]
                                : this.region,
                        },
                    });
                });
        },
    },
};
</script>
<style lang="less" scoped>
.mainBox {
    height: calc(100vh - 110px);
    h3 {
        text-align: center;
    }
    h2 {
        margin: 10px;
    }
    h6 {
        text-align: center;
        font-size: 20px;
        font-weight: 400;
        margin: 20px;
    }
}
.search {
    padding: 10px;
    margin-left: 1%;
    margin-right: 1%;
    box-shadow: 0px 1px 3px #0053a1;
    /deep/ .el-cascader {
        .el-input {
            input {
                background-color: var(--input-bgc);
            }
        }
        .el-input__inner::placeholder {
            color: var(--input-fc);
        }
    }
}
/deep/ .el-input__inner::placeholder {
    color: var(--color);
}
.fromBox {
    margin-left: 1%;
    margin-right: 1%;
    padding-bottom: 20px;
    box-shadow: 0px 1px 3px #0053a1;
    max-height: calc(100% - 180px);
    overflow-y: scroll;
    overflow-x: none;
    margin-top: 10px;
    display: flex;
    justify-content: space-around;
    .item {
        display: flex;
        justify-content: center;
        margin-bottom: 20px;
        span {
            width: 140px;
            height: 40px;
            text-align: end;
            margin-right: 20px;
            line-height: 40px;
        }
        .el-input {
            width: 200px;
            margin-right: 20px;
        }
    }
    .ra {
        align-items: center;
        .cc {
            width: 440px;
        }
    }
    .re {
        .el-input {
            width: 420px !important;
            margin-right: 20px;
        }
    }
    .test {
        width: 48%;
        padding-bottom: 20px;
    }
    .debug {
        width: 48%;
    }
}
.fromBox::-webkit-scrollbar {
    width: 0px;
}
.end {
    margin: 30px 0;
    height: 40px;
    width: 80px;
    color: #fff;
    background-color: #000810;
    position: absolute;
    left: calc(50% - 15px);
    border-radius: 3px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.end:hover {
    background-color: #010101;
}

//代码
/deep/ .el-cascader {
    .el-input {
        input {
            background-color: var(--input-bgc);
        }
    }
    .el-input__inner::placeholder {
        color: var(--input-fc);
    }
}
/deep/ .el-table__header-wrapper .el-table__cell {
    padding: 1px 0;
}
/deep/ .el-table thead {
    color: var(--main-fc);
}
/deep/ .el-table {
    border: none;
    padding: 0;
    .el-table__row {
        border: none;
    }
    input {
        background-color: var(--input-bgc);
    }
    .el-input__inner::placeholder {
        color: var(--input-fc);
    }
    color: var(--main-fc);
}
/deep/ .el-table td.el-table__cell,
/deep/ .el-table th.el-table__cell.is-leaf {
    border-bottom: none;
}
/deep/ input {
    color: #fff;
}
/deep/ input[placeholder] {
    &::placeholder {
        color: var(--color);
    }
}
/deep/ .el-table thead.is-group th.el-table__cell {
    background-color: var(--main-bgc);
}
/deep/ input {
    background-color: var(--input-bgc);
}
/deep/ .el-input__inner::placeholder {
    color: var(--input-fc);
}
</style>
